export function useTable() {
    const gridOptions = reactive<any>({
        border: true,
        columnConfig: {
            resizable: true,
        },
        columns: [
            { title: '', type: 'checkbox', width: '60' },
            {
                field: 'logo',
                fieldProps: {
                    style: {
                        borderRadius: '50%',
                        height: '20px',
                        width: '20px',
                    },
                },
                slots: { default: 'menuPath' },
                title: '应用图标',
                valueType: 'img',
            },
            { field: 'menuName', title: '应用名称' },
            { field: 'menuUrl', title: '应用链接' },
            { field: 'menuCode', title: '应用编码' },
            { field: 'status', slots: { default: 'status' }, title: '应用状态' },
            { field: 'createName', title: '创建人' },
            { field: 'createTime', title: '创建时间' },
            { field: 'updateTime', title: '最后修改时间', width: 120 },
            { slots: { default: 'operate' }, title: '操作', width: 200 },
        ],
        data: [],
        editConfig: {
            mode: 'row',
            showStatus: true,
            trigger: 'manual',
        },
        height: 530,
        keepSource: true,
        loading: false,
        pagerConfig: {
            currentPage: 1,
            enabled: true,
            pageSize: 10,
            pageSizes: [10, 20, 50, 100, 200, 500],
            total: 0,
        },
        showOverflow: true,
    })

    const btns = [
        {
            label: '编辑',
            value: 'edit',
        },
        {
            label: '删除',
            value: 'delete',
        },
    ]
    const formatTag = (row: any) => {
        if (row?.memberTagList && row?.memberTagList?.length)
            return row?.memberTagList

        return []
    }
    return { btns, formatTag, gridOptions }
}
